import Vue from 'vue'
import 'babel-polyfill'

import 'normalize.css/normalize.css' // A modern alternative to CSS resets

import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
import locale from 'element-ui/lib/locale/lang/zh-CN' // lang i18n

import '@/styles/index.scss' // global css

import App from './App'
import router from './router'
import store from './store'

import '@/icons' // icon
import '@/permission' // permission control

Vue.use(ElementUI, { locale })

Vue.config.productionTip = false

Vue.directive('permission', {
  inserted(el, binding) {
    const permissions = store.getters.permissions.length > 0 ? store.getters.permissions : JSON.parse(sessionStorage.getItem('permissions'))
    const permissionCode = binding.value.permissionCode
    let isPermission = false
    if (permissions) {
      isPermission = permissions.some(permission => permission.code === permissionCode)
    }
    if (!isPermission) {
      el.style.display = 'none'
    }
  }
})

new Vue({
  el: '#app',
  router,
  store,
  render: h => h(App)
})
